h1, h2, h3, h4, h5, h6
    margin-bottom 0
    color accent1
    .docs-panel-Docs &
        margin-top 1.5em
        &:first-child
            margin-top 1rem
h2, h3
    font-weight 400
h4, h5, h6
    font-weight 700
h1
    font-weight 300
h1, h2, h3, h4, h5, h6
    & > svg:first-child
        margin-inline-end 0.25em
        vertical-align middle
        & + span
            vertical-align middle
h1 > svg:first-child
    stroke-width 1.25
    width 1.75rem
    height @width

p
    margin 1em 0
    .docs-panel-Docs &
        margin 0.75em 0
        line-height 1.5

a, .a
    color act
    cursor pointer
    text-decoration none
    {trans}
    &:hover
        color accent1
    &.error
        color error
    &.success
        color success
    &.warning
        color warning
    .error, .success, .warning
        &:hover
            opacity 0.8
dd
    margin 0
dt
    font-weight 500

/* Codeblocks */
pre
    background backgroundDeeper
    border 1px solid borderBright
    border-radius br
    padding 0.4em 0.8em
    font-family font-mono
    overflow auto
    max-height 30rem
textarea.monospace
    font-family font-mono
    width 100%

/* Inline code */
code
    font-family font-mono
    &.inline, p > &, li > &
        padding 0 0.5rem
        margin 0 0.25rem
        border-radius br
        background borderPale
        border 1px solid borderBright
        text-shadow 0 1px 0 rgba(background, 0.65)
        .active &
            color act
.monospace
    font-family font-mono

.aNotice
    line-height 1.5
    font-style italic
    opacity 0.8
    margin 0

blockquote
    border-left 2px solid accent1
    margin 1rem 0
    padding 1rem 2rem
    p:first-child
        margin-top 0
    p:last-child
        margin-bottom 0

/* Contrasting background for small labels, designed for strings
   placed on top of colorful/hard-to-read backgrounds */
.aContrastingPlaque
    border-radius br
    background rgba(background, 0.5)
    padding 0.15em 0.5em
    box-sizing border-box
    color mix(foreground, text, 50%)
